<template>
	<view class="wha bb">
		<!-- <view class="">阴历 阳历</view> -->
		<!-- <view class="">满文 nikan</view> -->
		<view class="wa d_f_bet" style="line-height: 100rpx;">
			<view class="">△</view>		<!-- 返回今天 -->
			<view class="d_f_aro">
				<view class="">←</view>
				<view class="the_day d_f_cen fz48">		<!-- 选择日期 -->
					{{year}} - {{month + 1}} - {{day}}
				</view>
				<view class="">→</view>
			</view>
			<view class="">语言</view>	<!-- 语言选择 -->
		</view>
		<view class="tbody m0_a">
			<view class="trow wa d_f_sarwc">
				<view class="item week_name bb tac pos_rel" v-for="item in weekName[language]">
					<view class="man_font fz48 pos_abs">{{item}}</view>
				</view>
			</view>
			<view class="trow wa d_f_sarwc">
				<view class="item t_item tac bb" v-for="item in date" :name="`${item.year}-${addo(item.month+1)}-${addo(item.day)}`">
					{{item.day}}
				</view>
			</view>
		</view>
	</view>
</template>
<script>
	export default {
		name: 'canvasMain',
		props: [],
		data() {
			return {
				language: 0,
				weekName: [
					// https://www.sohu.com/a/380222935_158953
					["ᠪᡳᠶᠠ ᠮᠠᡶᠠᠯᡳ","ᡨᡠᠸᠠ ᠮᠠᡶᠠᠯᡳ","ᠮᡠᡴᡝ ᠮᠠᡶᠠᠯᡳ","ᠮᠣᡠ ᠮᠠᡶᠠᠯᡳ","ᠠᡳᠰᡳᠨ ᠮᠠᡶᠠᠯᡳ","ᠪᠣᡳᡥᠣᠨ ᠮᠠᡶᠠᠯᡳ","ᡧᡠᠨ ᠮᠠᡶᠠᠯᡳ"],
					[" 星期一","星期二","星期三","星期四","星期五","星期六","星期日"],
					[" Monday","Tuesday","星期三","星期四","星期五","星期六","星期日"],				// 英语
					[" dies lunae","dies Martis","星期三","星期四","星期五","星期六","星期日"],		// 拉丁语
					[" lundi","mardi","星期三","星期四","星期五","星期六","星期日"]					// 法语
				],
				date: [{
					year: 2024,
					month: 0,
					day: 26
				}],
				year: 0,
				month: 0,
				day: 0,
				theYear: 0,
				theMonth: 0,
				theDay: 0,
			}
		},
		mounted() {
			this.init();
		},
		methods: {
			init() {
				this.year = this.theYear = new Date().getFullYear() - 1;		// 年
				this.month = this.theMonth = new Date().getMonth();			// 月
				this.day = this.theDay = new Date().getDate();				// 日
				this.getDateInfo();
			},
			getDateInfo() {
				var days = new Date( this.year, this.month + 1, 0 ).getDate();			// 得到当月天数
				var firstday = new Date( this.year, this.month, 1 ).getDay();			// 获取当月第一天是星期几
				var lastday = new Date( this.year, this.month, days ).getDay();			// 获取当月第一天是星期几
				if( firstday == 0) firstday = 7;
				this.date = [];
				// 补上个月
				if( firstday !== 1 ) {		// 第一天起就不用往前补
					let month = this.month - 1;
					let year = this.year;
					if( month < 0 ) {
						month = 12;
						year = this.year - 1;
					}
					var b_days = new Date( this.year, this.month, 0).getDate();		// 得到上月天数
					this.setDateInfo( year, month, firstday - 1, b_days - firstday + 2 )
				}
				// 当月
				this.setDateInfo( this.year, this.month, days, 1 );
				// 下个月
				if(lastday !== 7) {
					let month = this.month + 1;
					let year = this.year;
					if( month == 13 ) {
						month = 1;
						year = this.year + 1;
					}
					this.setDateInfo( year, month, 7 - lastday, 1 );
				}
			},
			setDateInfo(year,month,days,startDay) {
				console.log(999,year,month)
				for(var i = 0;i < days; i++) {
					this.date.push({
						year: year,
						month: month,
						day: startDay + i
					})
				}
				// console.log(222,this.date)
			},
			getPreDate() {
				var b_days = new Date(year,month, 0).getDate();		// 得到上月天数
			},
			// 一位数补0
			addo(md){
				if(md < 10) return "0" + md;
				else return md;
			},
		},
	}
</script>
<style>
.tbody {
	width: 700rpx;
	height: 900rpx;
	border-top: 1px solid #d9d9d9;
	border-left: 1px solid #d9d9d9;
}	
.item {
	width: 100rpx;
	border-right: 1px solid #d9d9d9;
	border-bottom: 1px solid #d9d9d9;
}
.week_name{
	height: 180rpx;
}
.the_day{
	
}
.man_font {
	line-height: 100rpx;
	padding-top: 20rpx;
}
</style>